// import {exeControlCommand} from '@/api/setting'
// import {CCard} from '@/components/card'
// import {IconImg} from '@/components/images'
import {View, Text, Switch, RootPortal, Button, Image} from "@tarojs/components"
import Taro from "@tarojs/taro"
import {useState, useEffect} from "react"
import {AtButton, AtInputNumber, AtSegmentedControl} from "taro-ui"
// import { AtForm, AtSwitch } from 'taro-ui'
// import btnControll from './btnControlls'
import {
	selectAddSetApi,
	editAddSetApi,
	editAutoSetDataApi,
	editManualSetDataApi
} from "@/api/additionConf.ts"
import "./auto.scss"

export const Auto: React.FC<{
	autoFormData: {
		intervalTime: number
		liquidLevel: number
	}
	autoSetDataId: number
	setAutoFormData: Function
	getCurrentConfFunc: Function
}> = ({autoFormData, setAutoFormData, autoSetDataId, getCurrentConfFunc}): JSX.Element => {
	/* 存储setDataId */
	//   const [setDataId,setSetDataId] = useState(0)

	//   useEffect(()=>{
	// setSetDataId(autoSetDataId)
	//   },[])

	// 修改间隔时间的函数
	const editIntervalTimeChange = (e: number) => {
		setAutoFormData({
			intervalTime: e,
			liquidLevel: autoFormData.liquidLevel
		})
	}

	// 修改液位值的函数
	const editLiquidLevelChange = (e: any) => {
		// console.log(e)
		// let x = String(e.target.value).indexOf(".") + 1
		// let y = String(e.target.value).length - x
		// let newStr = ""
		// if (y > 2) {
		// 	let d = x + 2
		// 	let nStr = e.target.value.substring(0, d)
		// 	console.log(nStr)
		// 	newStr = nStr
		// } else {
		// 	newStr = e.target.value
		// }
		// console.log(y + "位")
		setAutoFormData({
			intervalTime: autoFormData.intervalTime,
			liquidLevel: Number(e)
		})
	}

	// 保存自动配置的按钮点击事件
	const saveAutoConfClick = async () => {
		// 验证间隔时间和液位值不为0
		if (autoFormData.intervalTime == 0) {
			Taro.showModal({
				title: "提示",
				content: `间隔时间不能为 0`,
				success: function (res) {
					if (res.confirm) {
						console.log("用户点击确定")
					} else if (res.cancel) {
						console.log("用户点击取消")
					}
				}
			})
			return
		}
		if (autoFormData.liquidLevel == 0) {
			Taro.showModal({
				title: "提示",
				content: `液位值不能为 0`,
				success: function (res) {
					if (res.confirm) {
						console.log("用户点击确定")
					} else if (res.cancel) {
						console.log("用户点击取消")
					}
				}
			})
			return
		}

		// 验证成功后的保存提示
		Taro.showModal({
			title: "提示",
			content: `确定要保存自动模式下的配置吗?`,
			success: function (res) {
				if (res.confirm) {
					console.log("用户点击确定")
					autoSaveConfFunc()
					saveAutoConfAnimateFunc()
					stopSaveAutoConfAnimateFunc()
				} else if (res.cancel) {
					console.log("用户点击取消")
				}
			}
		})
		console.log(autoFormData)
	}

	// 保存自动配置执行动画函数
	const saveAutoConfAnimateFunc = () => {
		Taro.showLoading({
			title: "保存中",
			mask: true
		})
	}

	// 停止保存自动配置执行动画函数
	const stopSaveAutoConfAnimateFunc = () => {
		setTimeout(() => {
			Taro.hideLoading()
		}, 2000)
	}

	// 自动模式下保存自动配置数据的请求函数
	const autoSaveConfFunc = async () => {
		await editAutoSetDataApi({
			setDataId: autoSetDataId,
			autoCollectRate: autoFormData.intervalTime,
			limitValue: autoFormData.liquidLevel
		}).then(() => {
			Taro.showToast({
				title: "保存成功",
				icon: "success",
				duration: 2000
			})
		})
		getCurrentConfFunc()
	}

	return (
		<View className="form_box">
			<View className="form_item">
				<View className="label">
					<Text>间隔时间：</Text>
				</View>

				<AtInputNumber
					type="number"
					min={0}
					max={1000}
					step={1}
					value={autoFormData.intervalTime}
					onChange={e => {
						editIntervalTimeChange(e)
					}}
				/>

				<Text className="unit">分钟</Text>
			</View>
			<View className="form_item">
				<View className="label">
					<Text>液位值：</Text>
				</View>
				<AtInputNumber
					type="digit"
					min={0}
					max={1000}
					step={0.01}
					value={autoFormData.liquidLevel}
					onChange={e => {
						editLiquidLevelChange(e)
					}}
				/>
				<Text className="unit">cm</Text>
			</View>
			<AtButton className="save_btn" type="primary" onClick={saveAutoConfClick}>
				保存自动配置
			</AtButton>
		</View>
	)
}
